#box {
    width: 800px;
    margin: 100px auto;


    #lst {
        width: 100%;
        display: flex;
        justify-content: space-around;
        // align-items: center;
        flex-wrap: wrap;
        box-sizing: border-box;



        .bul:hover {
            border: 1px solid red;
        }

        .bul {
            box-sizing: border-box;

            width: 180px;
            height: 360px;
            margin-bottom: 20px;
            // margin-right: 10px;

            .bu12:hover .bu13 {

                transform: translateY(-40px);
            }

            .bu12 {
                width: 180px;
                height: 180px;
                position: relative;
                overflow: hidden;

                .img1 {
                    width: 100%;
                    height: 100%;
                }

                .bu13 {
                    position: absolute;
                    width: 100%;
                    height: 40px;
                    background-color: #ec551f;
                    opacity: 0.8;
                    // display: none;
                    bottom: -40px;
                    transition: all 100ms;

                    a {
                        line-height: 40px;
                        text-align: center;
                        font-size: 13px;
                        color: #fff;
                        box-sizing:
                            border-box;
                        width: 50%;
                        height: 40px;
                        display: inline-block;
                    }

                    a:nth-child(1) {
                        border-right: 1px solid #ccc;
                    }
                }
            }

            .list {
                width: 100%;
                height: 30px;
                margin: 5px 0;

                box-sizing: border-box;
                display: flex;

                li:hover img {
                    border: 1px solid red;
                }

                li {
                    width: 30px;
                    height: 30px;
                    margin: 0 5px;

                    img {
                        width: 30px;
                        height: 30px;

                    }

                }
            }

            .box1 {
                width: 100%;
                box-sizing: border-box;
                padding: 0 5px;

                .p1 {
                    display: flex;
                    justify-content: space-between;

                    .span1 {
                        color: #F40;
                        font-weight: 700;
                    }

                    .span2 {
                        color: #888;
                        font-size: 13px;
                    }
                }

                .p2:hover {
                    color: #F40;
                    text-decoration: underline;
                }

                .p2 {
                    width: 100%;
                    font-size: 13px;
                    color: #3d3d3d;
                    text-decoration: none;

                    line-height: 16px;
                    margin: 5px 0;

                    .span3 {
                        color: #fff;
                        display: inline-block;
                        height: 100%;
                        width: 27px;
                        background: red;
                    }
                }

                .p3 {
                    width: 100%;
                    height: 22px;
                    font-size: 12px;
                    color: #888;

                    i {
                        color: red;
                        margin-right: 2px;
                    }

                    .span4 {
                        float: right;
                    }
                }

                .p4 {
                    font-size: 16px;
                    line-height: 16px;
                    margin-top: 10px;
                    display: flex;
                    justify-content: space-between;

                    .span5 {
                        color: goldenrod;

                    }

                    .span6 {
                        color: #1c9eff;
                    }
                }
            }
        }
    }

}